﻿<!DOCTYPE html>
<html>
<head>
  <!--  采用canvas绘制游戏界面, Local Storage记录游戏状态 -->
  <title> 疯狂俄罗斯方块 </title>
  <meta name="viewport" content="target-densitydpi=320,width=640,user-scalable=no"/>
  <script src="tetris.js"></script>
  <style>
    /* 使用服务器字体
    @font-face{  
      font-family:tmb;
      src:url("DS-DIGIB.TTF") format("TrueType");
    } */
    body>div{
      font-size:13pt;
      padding-bottom:8px;
    }
    span{
      font-family:tmb;
      font-size:20pt;
      color:green;
    }
    button{
      height:50px;
      width: 80px;
    }
  </style>
</head>
<body style="text-align:center;">

  <h2> 疯狂俄罗斯方块 </h2>
  <div style="width:336px;border:1px solid black;background:#ff9;margin:10px auto;">
  	&nbsp;
    <div style="float:left;">
	      速度：<span id="curSpeedEle"></span>
	      当前积分：<span id="curScoreEle"></span>
    </div>
    <div style="float:right;">
	      最高积分：<span id="maxScoreEle"></span>
    </div>
  </div>
  <div id="canvas"></div>
  <div>
    <button onclick="rotate();">变形(↑)</button>
    <button onclick="moveDown();">&nbsp;↓&nbsp;</button>
    <button onclick="moveLeft();">&nbsp;←&nbsp;</button>
    <button onclick="moveRight();">&nbsp;→&nbsp;</button>
  </div>

</body>
</html>